<%-- 
    Document   : AltaSocio
    Created on : 17-feb-2014, 21:16:25
    Author     : Daniel
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!doctype html>
<html>
<head>
 <title>Alta Socio Familiar</title>
	<link rel=StyleSheet href="styles.css" type="text/css" media="all"/>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<%
        int nro = Integer.valueOf(request.getParameter("nrosoc"));
%>   
<script type="text/javascript">
function validarForm(form){
                if ((form.categoria.value=="0") || (form.categoria.value=="Selec. Categoria")){
                         alert("Debe seleccionar la categoría del socio"); 
 			 form.categoria.focus();
			 return false;
		} 

                if ((form.parentesco.value=="0") || (form.parentesco.value=="Selec. Grado Parentesco")){
                         alert("Debe seleccionar el grado de parentesco"); 
 			 form.parentesco.focus();
			 return false;
		} 
                
 		if ((form.nombre.value=="")||form.nombre.value.lenght==0){
			alert ("Debe ingresar el nombre del socio");
			form.nombre.focus();
			return false;
		}    
                
		if ((form.apellido.value=="")||form.apellido.value.lenght==0){
			alert ("Debe ingresar su apellido del socio");
			form.apellido.focus();
			return false;
		}
                
		if ((form.fechanac.value=="")||form.fechanac.value.lenght==0){
			alert ("Debe ingresar la fecha de nacimiento del socio");
			form.fechanac.focus();
			return false;
		}
                
                if ((form.tipodoc.value=="0") || (form.tipodoc.value=="Selec. Tipo Doc.")){
                         alert("Debe seleccionar el tipo de documento"); 
 			 form.tipodoc.focus();
			 return false;
		}  

 		if ((form.dni.value=="")||form.dni.value.lenght==0){
			alert ("Debe ingresar el nro de documento del socio");
			form.dni.focus();
			return false;
		}

                if (isNaN(form.dni.value)){
		    alert ("Debe ingresar un número de documento válido. Debe contener solo caracteres numéricos");                    
                    form.dni.focus();
                    return false;
                   }

                if((form.dni.value.length<7)||(form.dni.value.length>9)){                   
                    alert ("Debe ingresar un número documento válido cuyo tamaño debe ser de 7 / 8 cifras.");                    
                    form.dni.focus();
                    return false;                    
                   }
                   
  
                
                if ((form.sexo.value=="0") || (form.sexo.value=="Seleccione Sexo")){
                         alert("Debe seleccionar el sexo del socio"); 
 			 form.sexo.focus();
			 return false;
		}   
                

                if (form.nro.value.toUpperCase()!="S/N") {
                 if (isNaN(form.nro.value)){
		    alert ("Debe ingresar una altuara válido. Debe contener solo caracteres numéricos o en su defecto S/N.");                    
                    form.nro.focus();
                    return false;
                 }
                }

                
               if ((form.telpart.value!="")||form.telpart.value.lenght>0){
                if (isNaN(form.telpart.value)){
		    alert ("Debe ingresar un número telefónico válido. Debe contener solo caracteres numéricos");                    
                    form.telpart.focus();
                    return false;
                   }
               }  
                   
               if ((form.telcel.value!="")||form.telcel.value.lenght>0){                   
                if (isNaN(form.telcel.value)){
		    alert ("Debe ingresar un número de celular válido. Debe contener solo caracteres numéricos");                    
                    form.telcel.focus();
                    return false;
                   }
               }
         
		form.submit();
	 }
         
</script>    
    
</head>

<form  action="ServletAltaSocioFam?nrosoc=<%= nro %>" target="_blank" method="post" name="RegistroFam" id="RegistroFam" onSubmit="validarForm(this); return false;">  
<div id="container">
   <div id="container1">
     <div style="width: 150px; display: inline-block">
        <img src="Imagenes\escudo.JPG" Style="text-decoration:underline; width: 115px; height: 80px; border: 0px; padding: 0px; margin-left: 7px" alt="" />                  
     </div>
     <div style="width: 970px; height: 100%; display: inline-block; overflow: hidden">
       <h3>Sistema de Gestion Centro Naval</h3>
       <h4>Atención al Socio</h4>
     </div>
   </div>            

<div id="container2" style="display: inline-block">
 <div  id="wrapper" class="body1">
	<ul class="menu">
		<li ><a href="#">Gestión de Socios</a>
			<ul>
				<li ><a class="inhab" href="#">Alta Socios</a></li>
				<li ><a href="ConsultaSocio.jsp#tab1">Consulta Socios</a></li>
				<li ><a href="#">Baja Socios</a></li>
			</ul>
		</li>
		<li ><a href="#">Videos </a>
			<ul>
				<li ><a href="#">Cute Kittens </a></li>
				<li ><a href="#">Strange â€œStuffâ€ </a></li>
				<li ><a href="#">Automatic Fails </a></li>
			</ul>
		</li>
		<li ><a href="#">Galleries </a>
			<ul>
				<li ><a href="#">Cute Kittens </a></li>
				<li ><a href="#">Strange â€œStuffâ€</a></li>
				<li class="subitem3"><a href="#">Automatic Fails </a></li>
			</ul>
		</li>
		<li class="item4"><a href="#">Podcasts</a>
			<ul>
				<li class="subitem1"><a href="#">Cute Kittens</a></li>
				<li class="subitem2"><a href="#">Strange â€œStuffâ€</a></li>
				<li class="subitem3"><a href="#">Automatic Fails</a></li>
			</ul>
		</li>
		<li class="item5"><a href="#">Robots</a>
			<ul>
				<li class="subitem1"><a href="#">Cute Kittens</a></li>
				<li class="subitem2"><a href="#">Strange â€œStuffâ€</a></li>
				<li class="subitem3"><a href="#">Automatic Fails</a></li>
			</ul>
		</li>
	</ul>
</div>
</div>

<div id="container3" style="display: inline-block">
    <div id="titulo">Alta de Socio Familiar</div>    
    <div id="titulo2">Datos Personales</div>
    
<div style="display: inline-block; width: 48%">    
    <label class="eti_fondo" for="categoria">* Cat. Socio: </label>
    <SELECT style="display: inline-box; width: 25"  name="categoria" id="categoria" >
        <option value="0" selected="">Selec. Categoría</option>
       <OPTION value="1">Titular</option>
       <OPTION value="2">Familiar</option>
       <OPTION value="3">Adherente</option>
    </SELECT>
</div> 
<div style="display: inline-block; width: 48%">   
    <label class="eti_fondo" for="parentesco">* Grado de Parentesco: </label>
    <SELECT style="display: inline-box; width: 40"  name="parentesco" id="parentesco" >
        <option value="0" selected="">Selec. Grado Parentesco</option>
       <OPTION value="1">Esposa</option>
       <OPTION value="2">Hijo / a</option>
       <OPTION value="3">Nieto / a</option>
       <OPTION value="4">Padres / Suegros</option>       
    </SELECT>    
</div>
<div class="sep">
    <div style="display: inline-block; width: 35%"><label class="eti_fondo" for="nombre">* Nombre: </label>
    <input style="display: inline-box;" name="nombre" type="text" id="nombre" size="37"/></div>

    <div style="display: inline-block; width: 35%"><label class="eti_fondo" for="apellido">* Apellido: </label>
    <input style="display: inline-box;" name="apellido" type="text"  id="apellido" size="37"/></div>

    <div style="display: inline-block; width: 27%"><label class="eti_fondo" for="fechanac">* Fecha Nac: </label>
    <input style="display: inline-box; "type="date" name="fechanac" id="fechanac" size="9"></div>
 </div> 
<div class="sep" style="width: 100%">
<div style="display: inline-block; width: 18%">
    <label class="eti_fondo" for="tipodoc">* Tipo Doc: </label>
    <SELECT style="display: inline-box; width: 80px"  name="tipodoc" id="tipodoc" >
        <option value="0" selected="">Selec. Tipo Doc.</option>
       <OPTION value="1">DNI</option>
       <OPTION value="2">CI</option>
       <OPTION value="3">LE</option>
       <OPTION value="4">LC</option>
       <OPTION value="5">Pasaporte</option>                        
    </SELECT>
</div>
    <div style="display: inline-block; width: 22%">
        <label class="eti_fondo" for="dni">* Nro. Doc: </label>
        <input style="display: inline-box; maxlenght:8" name="dni" type="text" id="dni" size="15"/>
    </div>    
    <div style="display: inline-block; width: 21%">
        <label class="eti_fondo" for="grupo">Grupo Sang: </label>
        <SELECT style="display: inline-box; width: 80px"  name="grupo" id="grupo" >
            <option value="0" selected="">Selec. Grupo Sang.</option>
            <OPTION value="1">A</option>
            <OPTION value="2">B</option>
            <OPTION value="3">AB</option>
            <OPTION value="4">0</option>                 
        </SELECT>
    </div>
    <div style="display: inline-block; width: 17%">
        <label class="eti_fondo" for="factor">Factor: </label>
        <SELECT style="display: inline-box; width: 80px"   name="factor" id="factor">
            <option value="0" selected="">Selec. Factor</option>
            <OPTION value="1">+</option>
            <OPTION value="2">-</option>
        </SELECT>
    </div>    

    <div style="display: inline-block; width: 18%">
        <label class="eti_fondo" for="sexo">* Sexo: </label>
        <SELECT style="display: inline-box; width: 80px"  name="sexo" id="sexo" >
            <option value="0" selected="">Selec. Sexo</option>
            <OPTION value="1">M</option>
            <OPTION value="2">F</option>            
        </SELECT>
    </div>    
</div>    

<div id="titulo1">Dirección</div>    
<div class="sep">
    <div style="display: inline-block; width: 350px"><label class="eti_fondo" for="calle">Calle: </label>
    <input style="display: inline-box;" name="calle" type="text" id="calle" size="40"/></div>

    <div style="display: inline-block; width: 160px"><label class="eti_fondo" for="nro">Nro: </label>
    <input style="display: inline-box;" name="nro" type="text"  id="nro" size="5"/></div>

    <div style="display: inline-block; width: 140px"><label class="eti_fondo" for="piso">Piso: </label>
    <input style="display: inline-box;" name="piso" type="text"  id="piso" size="2"/></div>
    
    <div style="display: inline-block; width: 140px"><label class="eti_fondo" for="depto">Dpto: </label>
    <input style="display: inline-box;" name="depto" type="text"  id="depto" size="2"/></div>    
</div>

 <div class="sep">
    <div style="display: inline-block; width: 33%"><label class="eti_fondo" for="localidad">Localidad: </label>
    <input style="display: inline-box;" name="localidad" type="text" id="localidad" size="20"/></div>

    <div style="display: inline-block; width: 33%"><label class="eti_fondo" for="provincia">Provincia: </label>
    <input style="display: inline-box;" name="provincia" type="text"  id="provincia" size="25"/></div>

    <div style="display: inline-block; width: 33%"><label class="eti_fondo" for="pais">País: </label>
    <input style="display: inline-box;" name="pais" type="text"  id="pais" size="25"/></div>
</div> 
    
 <div class="sep">
    <div style="display: inline-block; width: 28%"><label class="eti_fondo" for="codpostal">Cod. Postal: </label>
    <input style="display: inline-box;" name="codpostal" type="text"  id="codpostal" size="10"/></div>    

    <div style="display: inline-block; width: 35%"><label class="eti_fondo" for="telpart">Tel. Part.: </label>
    <input style="display: inline-box;" name="telpart" type="text"  id="telpart" size="17"/></div>

    <div style="display: inline-block; width: 35%"><label class="eti_fondo" for="telcel">Tel. Cel.: </label>
    <input style="display: inline-box;" name="telcel" type="text"  id="telcel" size="17"/></div>
</div>  

<div id="titulo1">Datos Web</div> 
 <div class="sep">
    <div style="display: inline-block; width: 100%"><label class="eti_fondo" for="email">E-mail: </label>
    <input style="display: inline-box;" name="email" type="text"  id="email" size="30"/></div>    
 </div>
 <div class="sep">    
<div style="margin-top: 5px; margin-left: 10px">
    <div style="display: inline-block; width: 85%"><h5>* Campos obligatorios.</h5></div>
    <div style="display: inline-block; width: 14%"><input type="submit" class="button" name="grabar" value="Grabar" ></div>        
</div>
</div> 
</div> 
</div>


<!--initiate accordion-->
<script type="text/javascript">
	$(function() {
	
	    var menu_ul = $('.menu > li > ul'),
	           menu_a  = $('.menu > li > a');
	    
	    menu_ul.hide();
	
	    menu_a.click(function(e) {
	        e.preventDefault();
	        if(!$(this).hasClass('active')) {
	            menu_a.removeClass('active');
	            menu_ul.filter(':visible').slideUp('normal');
	            $(this).addClass('active').next().stop(true,true).slideDown('normal');
	        } else {
	            $(this).removeClass('active');
	            $(this).next().stop(true,true).slideUp('normal');
	        }
	    });
	
	});
</script>
</form>  

</html>

